{include file="admin/common/header" /}
<style>
    .fl {
        float: left;
    }

    .layui-word-aux {
        margin-left: 8px;
    }
</style>
<body>
<form class="layui-form" action="">
    <div class="mainBox">
        <div class="main-container">
            <div class="layui-form-item">
                <label class="layui-form-label required">任务名称</label>
                <div class="layui-input-block">
                    <input type="text" name="title" lay-verify="required" autocomplete="off" placeholder="请输入任务名称"
                           class="layui-input" value="">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">任务类型</label>
                <div class="layui-inline">
                    <select name="type">
                        <option value="1">command【命令行】</option>
                        <option value="2">class【类方法】</option>
                        <option value="3">url【url网址】</option>
                        <option value="4">eval【eval】</option>
                        <option value="5">shell【shell】</option>
                    </select>
                </div>
            </div>
            <!--<div class="layui-form-item">
                <label class="layui-form-label">执行表达式</label>
                <div class="layui-input-block">
                    <input type="text" name="rule" lay-verify="required" autocomplete="off" placeholder="执行表达式，例如：0 */2 * * *"
                           class="layui-input" value="">
                </div>
            </div>-->
            <div class="layui-form-item">
                <label class="layui-form-label">执行周期</label>
                <div class="layui-input-block">
                    <div class="layui-inline" style="width:100px;float:left">
                        <select name="time_cycle" class="" autocomplete="off" lay-filter="check_crontab_type">
                            <option value="day" selected="">每天</option>
                            <option value="day-n">N天</option>
                            <option value="hour">每小时</option>
                            <option value="hour-n">N小时</option>
                            <option value="minute-n">N分钟</option>
                            <option value="second-n">N秒钟</option>
                            <option value="week">每星期</option>
                            <option value="month">每月</option>
                        </select>
                    </div>
                    <div id="select-time-model"></div>

                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label required">任务字符串</label>
                <div class="layui-input-block">
                    <input type="text" name="target" lay-verify="required" autocomplete="off" placeholder="请输入任务字符串"
                           class="layui-input" value="">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">任务参数(url和eval无效)</label>
                <div class="layui-input-block">
                    <input type="text" name="parameter" autocomplete="off" placeholder="请输入任务参数"
                           class="layui-input" value="">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label required">备注</label>
                <div class="layui-input-block">
                    <input type="text" name="remark" lay-verify="required" autocomplete="off" placeholder="请输入备注"
                           class="layui-input" value="">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">排序</label>
                <div class="layui-input-inline">
                    <input type="number" name="sort" lay-verify="required" autocomplete="off" placeholder="请输入排序"
                           class="layui-input" value="0">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">状态</label>
                <div class="layui-input-block">
                    <input type="radio" name="status" value="1" title="启用" checked>
                    <input type="radio" name="status" value="0" title="禁用">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">是否单次执行</label>
                <div class="layui-input-block">
                    <input type="radio" name="singleton" value="1" title="不是" checked>
                    <input type="radio" name="singleton" value="0" title="是">
                </div>
            </div>

        </div>
    </div>
    <div class="bottom">
        <div class="button-container">
            <button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit=""
                    lay-filter="admin-save">
                <i class="layui-icon layui-icon-ok"></i>
                提交
            </button>
            <button type="reset" class="pear-btn pear-btn-sm">
                <i class="layui-icon layui-icon-refresh"></i>
                重置
            </button>
        </div>
    </div>
</form>

{include file="admin/common/footer" /}
<script>
  layui.use(['form', 'jquery'], function () {
    let form = layui.form;
    let $ = layui.jquery;

    let timeCycle = $("select[name='time_cycle']").find('option:selected').val()
    select_input_time(timeCycle);

    form.on('select(check_crontab_type)', function (data) {
      select_input_time(data.value);
      form.render();
    });

    form.on('submit(admin-save)', function (data) {
      $.ajax({
        url: "/app/crontab/crontab/add",
        data: JSON.stringify(data.field),
        dataType: 'json',
        contentType: 'application/json',
        type: 'post',
        success: function (res) {
          if (res.code === 200) {
            hui_msg(res.msg, 1, function () {
              window.location.reload();
            });
          } else {
            hui_msg(res.msg, 2);
          }
        }
      })
      return false;
    });
  })

  function select_input_time(timeCycle) {
    let str = '';
    if (timeCycle == 'day') {
      str = '<div id="" style="float:left">\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="text" name="hour" min="0" max="23" lay-verify="required" placeholder="小时" autocomplete="off"\n' +
        '               class="layui-input fl" value="1" style="width:70px;">\n' +
        '        <div class="layui-form-mid layui-word-aux">[小时]</div>\n' +
        '    </div>\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="minute" min="0" max="59" class="layui-input fl"\n' +
        '               style="width:70px;" value="1">\n' +
        '        <div class="layui-form-mid layui-word-aux">[分钟]</div>\n' +
        '    </div>\n' +
        '</div>';
    } else if (timeCycle == 'day-n') {
      str = '<div style="float:left">\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="where1" min="1" max="31" class="layui-input fl"\n' +
        '               style="width:70px;" value="3">\n' +
        '        <div class="layui-form-mid layui-word-aux">[天]</div>\n' +
        '    </div>\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="hour" min="0" max="23" placeholder="小时" autocomplete="off"\n' +
        '               class="layui-input fl" value="1" style="width:70px;">\n' +
        '        <div class="layui-form-mid layui-word-aux">[小时]</div>\n' +
        '    </div>\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="minute" min="0" max="59" class="layui-input fl"\n' +
        '               style="width:70px;" value="1">\n' +
        '        <div class="layui-form-mid layui-word-aux">[分钟]</div>\n' +
        '    </div>\n' +
        '</div>';
    } else if (timeCycle == 'hour') {
      str = '<div style="float:left">\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="minute" min="0" max="59" class="layui-input fl"\n' +
        '               style="width:70px;" value="1">\n' +
        '        <div class="layui-form-mid layui-word-aux">[分钟]</div>\n' +
        '    </div>\n' +
        '</div>';
    } else if (timeCycle == 'hour-n') {
      str = '<div style="float:left"><div class="layui-inline">\n' +
        '    <input type="number" name="hour" min="0" max="23" placeholder="小时" autocomplete="off"\n' +
        '           class="layui-input fl" value="1" style="width:70px;">\n' +
        '    <div class="layui-form-mid layui-word-aux">[小时]</div>\n' +
        '</div></div>\n' +
        '<div style="float:left">\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="minute" min="0" max="59" class="layui-input fl"\n' +
        '               style="width:70px;" value="1">\n' +
        '        <div class="layui-form-mid layui-word-aux">[分钟]</div>\n' +
        '    </div>\n' +
        '</div>';
    } else if (timeCycle == 'minute-n') {
      str = '<div style="float:left">\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="minute" min="0" max="59" class="layui-input fl"\n' +
        '               style="width:70px;" value="1">\n' +
        '        <div class="layui-form-mid layui-word-aux">[分钟]</div>\n' +
        '    </div>\n' +
        '</div>';
    } else if (timeCycle == 'second-n') {
      str = '<div style="float:left">\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="second" min="0" max="59" class="layui-input fl"\n' +
        '               style="width:70px;" value="3">\n' +
        '        <div class="layui-form-mid layui-word-aux">[秒钟]</div>\n' +
        '    </div>\n' +
        '</div>';
    } else if (timeCycle == 'week') {
      str = '<div class="fl">\n' +
        '    <div class="layui-inline" style="width:70px;">\n' +
        '        <select name="week" autocomplete="off">\n' +
        '            <option value="1" selected="">周一</option>\n' +
        '            <option value="2">周二</option>\n' +
        '            <option value="3">周三</option>\n' +
        '            <option value="4">周四</option>\n' +
        '            <option value="5">周五</option>\n' +
        '            <option value="6">周六</option>\n' +
        '            <option value="0">周日</option>\n' +
        '        </select>\n' +
        '    </div>\n' +
        '</div>\n' +
        '<div class="fl">\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="hour" min="0" max="23" placeholder="小时" autocomplete="off"\n' +
        '               class="layui-input fl" value="1" style="width:70px;">\n' +
        '        <div class="layui-form-mid layui-word-aux">[小时]</div>\n' +
        '    </div>\n' +
        '</div>\n' +
        '<div class="fl">\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="minute" min="0" max="59" class="layui-input fl"\n' +
        '               style="width:70px;" value="1">\n' +
        '        <div class="layui-form-mid layui-word-aux">[分钟]</div>\n' +
        '    </div>\n' +
        '</div>';
    } else if (timeCycle == 'month') {
      str = '<div class="layui-inline fl">\n' +
        '    <input type="number" name="where1" min="1" max="31" placeholder="日" autocomplete="off"\n' +
        '           class="layui-input fl" value="1" style="width:70px;">\n' +
        '    <div class="layui-form-mid layui-word-aux">[日]</div>\n' +
        '</div>\n' +
        '<div class="layui-inline fl">\n' +
        '    <input type="number" name="hour" min="0" max="23" placeholder="小时" autocomplete="off"\n' +
        '           class="layui-input fl" value="1" style="width:70px;">\n' +
        '    <div class="layui-form-mid layui-word-aux">[小时]</div>\n' +
        '</div>\n' +
        '<div style="float:left">\n' +
        '    <div class="layui-inline">\n' +
        '        <input type="number" name="minute" min="0" max="59" class="layui-input fl"\n' +
        '               style="width:70px;" value="1">\n' +
        '        <div class="layui-form-mid layui-word-aux">[分钟]</div>\n' +
        '    </div>\n' +
        '</div>';
    }
    document.getElementById('select-time-model').innerHTML = (str);
  }
</script>
<script>
</script>
</body>
</html>
